<template>
	<div>
		<personalItem :list="jobList" hasEmail="true" @delItem="delItem" @copyItem="copy" isNavicatTo="true"></personalItem>
	</div>
</template>

<script>
	import personalItem from "../../components/personalItem";
	export default {
		components: {
			personalItem: personalItem
		},
		data() {
			return {
				jobList: [],
				limit: 10,
				page: 1,
				userInfo: {}
			};
		},
		methods: {
			// 获取列表信息
			getList() {
				let data = {
					limit: this.limit,
					page: this.page,
					openid: this.userInfo.openid,
					type: 0,
					pageType: 3
				}
				this.sgAjax.getData("/user/myList", data).then(res => {
					uni.hideLoading()
					this.page += 1
					this.jobList = this.jobList.concat(res.data.list)
				})
			},

			// 删除
			delItem(index) {
				uni.showLoading({
					title: "加载中"
				})
				let data = {
					openid: this.userInfo.openid,
					type: 0,
					projectid: this.jobList[index].id,
					pageType: 3
				}
				this.sgAjax.getData("/user/delListItem", data).then(res => {
					uni.hideLoading()
					uni.showToast({
						title: "删除成功！",
						mask: true
					})
					this.jobList.splice(index, 1)
				})
			},
			// 复制
			copy(index) {
				uni.setClipboardData({
					data: this.jobList[index].email,
					success: () => {
						uni.showToast({
							title: "复制成功！"
						})
					}
				});
			}
		},
		onLoad() {
			this.userInfo = uni.getStorageSync("userInfo")
			uni.showLoading({
				title: "加载中"
			})
			this.getList()
		},
		onReachBottom() {
			this.getList()
		},
	};
</script>

<style scoped>
	.scrollContainer {
		justify-content: row;
		white-space: nowrap;
		width: 100%;
	}

	.scrollItem {
		display: inline-block;
		height: 100%;
		vertical-align: top;
	}

	.scrollItem1 {
		padding: 32rpx;
		padding-bottom: 0;
		box-sizing: border-box;
		width: 100%;
	}

	.borderBox {
		padding-bottom: 32rpx;
		border-bottom: 1rpx solid rgba(4, 3, 25, 0.1);
	}

	.scrollItem2 {
		width: 160rpx;
		height: 262rpx;
		background-color: #ff5756;
	}

	.flex-box2 {
		margin: 16rpx 0;
	}

	.flex-box {
		display: flex;
		justify-content: space-between;
	}

	.edit-image {
		width: 36rpx;
		height: 36rpx;
		vertical-align: middle;
	}

	.delete-image {
		margin-left: calc(80rpx - 18rpx);
		margin-top: calc(131rpx - 18rpx);
	}

	.font-title {
		font-size: 32rpx;
		color: #040319;
		line-height: 32rpx;
		font-weight: bold;
	}

	.font-title2 {
		opacity: 0.6;
		font-family: PingFangSC-Regular;
		font-size: 28rpx;
		color: #040319;
		line-height: 28rpx;
	}

	.font-title3 {
		opacity: 0.4;
		font-family: PingFang-SC-Regular;
		font-size: 24rpx;
		color: #040319;
		line-height: 24rpx;
	}

	.font-title4 {
		opacity: 0.8;
		font-family: PingFang-SC-Regular;
		font-size: 28rpx;
		color: #040319;
		line-height: 28rpx;
		margin-right: 36rpx;
	}

	.flex {
		display: flex;
		margin-top: 24rpx;
	}

	.copy-box {
		background: rgba(27, 130, 254, 0.1);
		border-radius: 4rpx;
		border-radius: 4rpx;
		font-size: 28rpx;
		color: #1b82fe;
		line-height: 28rpx;
		padding: 8rpx 16rpx;
	}

	.font-price {
		font-family: PingFangSC-Medium;
		font-size: 32rpx;
		color: #1b82fe;
		text-align: right;
		line-height: 32rpx;
	}

	.font-span {
		background: rgba(4, 3, 25, 0.04);
		border-radius: 4rpx;
		border-radius: 4rpx;
		opacity: 0.6;
		font-family: PingFang-SC-Regular;
		font-size: 22rpx;
		color: #040319;
		line-height: 22rpx;
		margin-right: 28rpx;
		padding: 8rpx 12rpx;
	}
</style>
